<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html >
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>花色号维护</title>
    <link rel="stylesheet" href="../static/layui-2.3.0/css/layui.css">

    <link href="../static/bootstrap-4.1.1/bootstrap.min.css"
          rel="stylesheet">
    <style type="text/css">
        #form-co-query .layui-form-label {
            width: auto;
            padding-left: 5px;
            padding-right: 5px;
        }
    </style>
</head>

<body>
<div style="padding: 5px 0 20px 3px;">
		<span class="layui-breadcrumb" lay-separator="-"> <a href="#">基础信息管理</a>
			<a><cite>花色信息维护</cite></a>
		</span>
</div>

<form class="layui-form" id="form-co-query">
    <div class="layui-form-item">
        <div class="layui-inline">

            <label class="layui-form-label">花色状态</label>
            <div class="layui-input-inline" style="width: 100px;">
                <!-- 00-未确定 22-确定 55-启用 77-禁用 99-逻辑删除 -->
                <select name="co_status" lay-verify="required" lay-filter="select-co-query-co-status">
                    <option value="">全部</option>
                    <option value="00">未确定</option>
                    <option value="22">确定</option>
                    <option value="55">启用</option>
                    <option value="77">禁用</option>
                    <option value="99">逻辑删除</option>
                </select>
            </div>

            <label class="layui-form-label">编号</label>
            <div class="layui-input-inline" style="width: 100px;">
                <input type="number" name="co_id" autocomplete="off"
                       class="layui-input">
            </div>
            <label class="layui-form-label">名称</label>
            <div class="layui-input-inline" style="width: 100px;">
                <input type="text" name="co_name" autocomplete="off"
                       class="layui-input">
            </div>
            <label class="layui-form-label">说明</label>
            <div class="layui-input-inline" style="width: 100px;">
                <input type="text" name="co_remark" autocomplete="off"
                       class="layui-input">
            </div>
            <button class="layui-btn" id="bn-co-query"><i class="layui-icon layui-icon-search"></i> 查询</button>
        </div>
    </div>
</form>


<div class="layui-btn-container">
    <button type="button" class="layui-btn" id="bn-co-add-multi"><i class="layui-icon">&#xe608;</i> 新增</button>
    <button type="button" class="layui-btn" id="bn-co-cfm-multi"><i class="layui-icon layui-icon-ok-circle"></i> 确定
    </button>
    <button type="button" class="layui-btn" id="bn-co-use-multi"><i class="layui-icon layui-icon-auz"></i> 启用</button>
    <button type="button" class="layui-btn" id="bn-co-unuse-multi"><i class="layui-icon layui-icon-fonts-del"></i> 禁用
    </button>
    <button class="layui-btn layui-btn-danger" id="bn-co-del-multi"><i class="layui-icon layui-icon-delete"></i> 删除
    </button>
</div>

<!-- 工具条定义 -->
<!-- 状态 00-未确定 22-确定 55-启用 77-禁用 99-逻辑删除 -->
<script type="text/html" id="barDemo">
    <!--  laytpl 语法， d指数据，在这里指当前行数据 -->
    {{#  if(d.co_status == '00' ){ }}
    <a class="layui-btn layui-btn-xs" lay-event="co_edit"><i class="layui-icon">&#xe608;</i> 编辑</a>
    <a class="layui-btn layui-btn-xs" lay-event="co_cfm"><i class="layui-icon layui-icon-ok-circle"></i> 确定</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="co_del"><i class="layui-icon layui-icon-delete"></i>
        删除</a>
    {{#  }else if(d.co_status == '22' || d.co_status == '77' ){  }}
    <a class="layui-btn layui-btn-xs" lay-event="co_use"><i class="layui-icon layui-icon-auz"></i> 启用</a>
    {{#  }else if(d.co_status == '55' ){  }}
    <a class="layui-btn layui-btn-xs" lay-event="co_unuse"><i class="layui-icon layui-icon-fonts-del"></i> 禁用</a>
    {{#  }else if(d.co_status == '99' ){  }}
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="co_del"><i class="layui-icon layui-icon-delete"></i>
        删除</a>
    {{#  }  }}
</script>


<table id="info-color-table" lay-filter="coTable"></table>


<script src="../static/js/jquery-3.3.1.min.js"></script>
<script src="../static/bootstrap-4.1.1/bootstrap.min.js"></script>
<script src="../static/layui-2.3.0/layui.js"></script>
<script src="../static/js/sweetalert-2.1.0.min.js"></script>
<script src="../static/js/common.js"></script>

<script type="text/javascript">

    //1.表格id#info-color-table
    //2.url接口
    //3.分页(默认true)
    //4.默认(显示数)
    //5.显示数组
    //6.


    layui.use(['element', 'table', 'layer', 'form'], function () {
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        //第一个实例
        var coTable = table.render({
            elem: '#info-color-table',
            url: 'color', //数据接口
            page: true, //开启分页
            limits: [5, 10, 20, 30],
            limit: 5,
           /*  size: 'sm',//小尺寸表格,
            even: true,//隔行变色 */
            cols: [[ //表头
                {
                    type: 'checkbox'
                }
                ,
                {
                    field: 'co_id',
                    title: '花色编号',
                    sort: true,
                    // event : 'setSign',
                    // style : 'cursor: pointer;'
                }
                , {
                    field: 'co_name',
                    title: '花色名称',
                    // edit : 'text'
                }
                , {
                    field: 'co_remark',
                    title: '花色说明',
                    // edit : 'text'
                }
                , {
                    field: 'co_status',
                    title: '花色状态',
                    //edit : 'text',
                    //00-未确定 22-确定 55-启用 77-禁用 99-逻辑删除
                    templet: function (d) {
                        if (d.co_status == '00') {
                            return '未确定';
                        }
                        if (d.co_status == '22') {
                            return '确定';
                        }
                        if (d.co_status == '55') {
                            return '启用';
                        }
                        if (d.co_status == '77') {
                            return '禁用';
                        }
                        if (d.co_status == '99') {
                            return '逻辑删除';
                        }
                    }
                }
                , {
                    fixed: 'right',
                    title: '操作',
                    toolbar: '#barDemo'
                }

            ]]
        });


        //监听select选择
        form.on('select(select-co-query-co-status)', function (data) {
            //console.log(data.elem); //得到select原始DOM对象
            //console.log(data.value); //得到被选中的值
            //console.log(data.othis); //得到美化后的DOM对象
            $('#bn-co-query').click();
        });


        //监听工具条
        table.on('tool(coTable)', function (obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象

            if (layEvent === 'co_cfm') {//确定
                //优化1.1
                opr.ajaxWithConfirm({
                    title: "您确实要确定该花色信息吗?",
                    text: "花色信息一旦确定将无法编辑!",
                    url: 'color/status/' + data.co_id + '/22',
                    method: 'put',
                    layer: layer,
                    layuiTableIns: coTable
                });


                //优化前
                // swal({
                //     title: "您确实要确定该客户信息吗?",
                //     text: "客户信息一旦确定将无法编辑!",
                //     icon: "warning",
                //     buttons: [
                //         "取消",
                //         {text: '确认', closeModal: false}
                //     ],
                //     dangerMode: true,
                // })
                //     .then(function (ok) {
                //             if (ok) {
                //                 $.ajax({
                //                     url: 'color/status/' + data.co_id + '/22',
                //                     method: 'put',
                //                     dataType: 'json'
                //                 }).done(function (result) {
                //                     if (result.success) {
                //                         swal({
                //                             text: result.message,
                //                             icon: "success",
                //                             buttons: false,
                //                             timer: 1500
                //                         });
                //                         coTable.reload();
                //                     } else {
                //                         swal({
                //                             title: result.message,
                //                             icon: "error",
                //                             button: "确定"
                //                         });
                //                     }
                //
                //                 }).fail(function (xhr) {
                //                     swal({
                //                         title: xhr.status,
                //                         icon: "error",
                //                         button: "确定"
                //                     });
                //                 });
                //             }
                //
                //
                //         }
                //     )
                //     .catch(function (err) {
                //         if (err) {
                //             swal("操作失败!", "请于管理员联系。", "error");
                //         } else {
                //             swal.stopLoading();//停止加载显示
                //             swal.close();//关闭提示框
                //         }
                //     });

            }
            else if (layEvent === 'co_use') {//启用

                //优化1.1
                opr.ajaxWithConfirm({
                    title: "您确实要启用该花色信息吗?",
                    url: 'color/status/' + data.co_id + '/55',
                    method: 'put',
                    layer: layer,
                    layuiTableIns: coTable
                });

                //优化前
                // swal({
                //     title: "您确实要启用该客户信息吗?",
                //     icon: "warning",
                //     buttons: [
                //         "取消",
                //         {text: '确认', closeModal: false}
                //     ],
                //     dangerMode: true,
                // })
                //     .then(function (ok) {
                //         if (ok) {
                //             $.ajax({
                //                 url: 'color/status/' + data.co_id + '/55',
                //                 method: 'put',
                //                 dataType: 'json'
                //             }).done(function (result) {
                //                 if (result.success) {
                //                     swal({
                //                         text: result.message,
                //                         icon: "success",
                //                         buttons: false,
                //                         timer: 1500
                //                     });
                //                     coTable.reload();
                //                 } else {
                //                     swal({
                //                         title: result.message,
                //                         icon: "error",
                //                         button: "确定"
                //                     });
                //                 }
                //
                //             }).fail(function (xhr) {
                //                 swal({
                //                     title: xhr.status,
                //                     icon: "error",
                //                     button: "确定"
                //                 });
                //             });
                //         }
                //
                //
                //     })
                //     .catch(function (err) {
                //         if (err) {
                //             swal("操作失败!", "请于管理员联系。", "error");
                //         } else {
                //             swal.stopLoading();//停止加载显示
                //             swal.close();//关闭提示框
                //         }
                //     });


            } else if (layEvent === 'co_unuse') {//禁用

                //优化1.1
                opr.ajaxWithConfirm({
                    title: "您确实要禁用该客户信息吗?",
                    url: 'color/status/' + data.co_id + '/77',
                    method: 'put',
                    layer: layer,
                    layuiTableIns: coTable
                });


                //优化前
                // swal({
                //     title: "您确实要禁用该客户信息吗?",
                //     icon: "warning",
                //     buttons: [
                //         "取消",
                //         {text: '确认', closeModal: false}
                //     ],
                //     dangerMode: true,
                // })
                //     .then(function (ok) {
                //         if (ok) {
                //             $.ajax({
                //                 url: 'color/status/' + data.co_id + '/77',
                //                 method: 'put',
                //                 dataType: 'json'
                //             }).done(function (result) {
                //                 if (result.success) {
                //                     swal({
                //                         text: result.message,
                //                         icon: "success",
                //                         buttons: false,
                //                         timer: 1500
                //                     });
                //                     coTable.reload();
                //                 } else {
                //                     swal({
                //                         title: result.message,
                //                         icon: "error",
                //                         button: "确定"
                //                     });
                //                 }
                //
                //             }).fail(function (xhr) {
                //                 swal({
                //                     title: xhr.status,
                //                     icon: "error",
                //                     button: "确定"
                //                 });
                //             });
                //         }
                //
                //
                //     })
                //     .catch(function (err) {
                //         if (err) {
                //             swal("操作失败!", "请于管理员联系。", "error");
                //         } else {
                //             swal.stopLoading();//停止加载显示
                //             swal.close();//关闭提示框
                //         }
                //     });


            } else if (layEvent === 'co_del') { //删除

                //优化1.1
                opr.ajaxWithConfirm({
                    title: "您确实要删除该条数据吗?",
                    text: "数据一旦删除将无法恢复!",
                    url: 'color/' + data.co_id,
                    method: 'delete',
                    layer: layer,
                    layuiTableIns: coTable
                });

                //优化前
                // swal({
                //     title: "您确实要删除该条数据吗?",
                //     text: "数据一旦删除将无法恢复!",
                //     icon: "warning",
                //     buttons: [
                //         "取消",
                //         {text: '确认删除', closeModal: false}
                //     ],
                //     dangerMode: true,
                // })
                //     .then(function (ok) {
                //         if (ok) {
                //             $.ajax({
                //                 url: 'color/' + data.co_id,
                //                 method: 'delete',
                //                 dataType: 'json'
                //             }).done(function (result) {
                //                 if (result.success) {
                //                     swal({
                //                         text: result.message,
                //                         icon: "success",
                //                         buttons: false,
                //                         timer: 1500
                //                     });
                //                     coTable.reload();
                //                 } else {
                //                     swal({
                //                         title: result.message,
                //                         icon: "error",
                //                         button: "确定"
                //                     });
                //                 }
                //
                //             }).fail(function (xhr) {
                //                 swal({
                //                     title: xhr.status,
                //                     icon: "error",
                //                     button: "确定"
                //                 });
                //             });
                //         }
                //
                //
                //     })
                //     .catch(function (err) {
                //         if (err) {
                //             swal("操作失败!", "请于管理员联系。", "error");
                //         } else {
                //             swal.stopLoading();//停止加载显示
                //             swal.close();//关闭提示框
                //         }
                //     });


            } else if (layEvent === 'co_edit') { //编辑

                //优化1.1
                opr.ajax({
                    url: 'color/' + data.co_id,
                    method: 'get',
                    layer: layer,
                    responseOkHandler: function (cus) {
                        //form-cus-upd是表单的lay-filter值
                        form.val("form-update-color", cus);

                        layerIdx = layer.open({
                            type: 1,
                            title: '修改花色信息',
                            area: ['800px', '540px'],
                            content: $('#div-update-color'),
                            zIndex: 100 //将层次降低，以使sweetalert能够在layer之上
                        });

                    }
                });


                //优化前
                //  var index = layer.load(); //加载层
                //  $.ajax({
                //      url: 'color/' + data.co_id,
                //      method: 'get',
                //      dataType: 'json'
                //  }).done(function (co) {
                //      layer.close(index);
                //      /* 表单初始赋值
                // 语法：form.val('lay-filter的值', object); */
                //      //form-cus-upd是表单的lay-filter值
                //      form.val("form-update-color", co);
                //      layerIdx = layer.open({
                //          type: 1,
                //          title: '修改客户信息',
                //          area: ['800px', '540px'],
                //          content: $('#div-update-color'),
                //          zIndex: 100 //将层次降低，以使sweetalert能够在layer之上
                //      });
                //  });


            }

        });


        //监听修改表单提交。bn-doupdate-color是修改表单中提交按钮的lay-filter值
        form.on('submit(bn-doupdate-color)', function (data) {
            //console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
            //console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
            console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}


            //优化1.1
            opr.ajax({
                url: 'color',
                data: JSON.stringify(data.field),
                method: 'put',
                contentType: 'application/json;charset=UTF-8',
                layer: layer,
                layuiTableIns: coTable,
                responseOkHandler: function (result) {
                    layer.close(layerIdx);
                    return true;//返回true,继续默认后续行为
                }
            });
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。

            //优化前
            // var index = layer.load(); //加载层
            // $.ajax({
            //     url: 'color',
            //     data: JSON.stringify(data.field),
            //     method: 'put',
            //     contentType: 'application/json;charset=UTF-8',
            //     dataType: 'json'
            // }).done(function (result) {
            //     if (result.success) {
            //         coTable.reload();//重载表格
            //         layer.closeAll();
            //         swal({
            //             text: result.message,
            //             icon: "success",
            //             buttons: false,
            //             timer: 1500
            //         });
            //     } else {
            //         layer.close(index);
            //         swal({
            //             title: result.message,
            //             icon: "error",
            //             button: "确定"
            //         });
            //     }
            // }).fail(function (xhr) {
            //     console.log(xhr);
            //     layer.close(index);
            //     swal({
            //         title: xhr.status,
            //         text: '请于管理员联系。',
            //         icon: "error",
            //         button: "确定"
            //     });
            // });
            // return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。


        });


        //显示按钮是否可用
        function showBns() {
            var _co_status = $('#form-co-query select[name=co_status]').val();
            console.log("_co_status=" + _co_status);
            if (_co_status == '') {
                $('#bn-co-add-multi,#bn-co-del-multi,#bn-co-cfm-multi,#bn-co-use-multi,#bn-co-unuse-multi').prop('disabled', true).addClass("layui-btn-disabled");
            } else if (_co_status == '00') {
                $('#bn-co-add-multi,#bn-co-del-multi,#bn-co-cfm-multi').prop('disabled', false).removeClass("layui-btn-disabled");
                $('#bn-co-use-multi,#bn-co-unuse-multi').prop('disabled', true).addClass("layui-btn-disabled");
            } else if (_co_status == '22') {
                $('#bn-co-add-multi,#bn-co-del-multi,#bn-co-cfm-multi,#bn-co-unuse-multi').prop('disabled', true).addClass("layui-btn-disabled");
                $('#bn-co-use-multi').prop('disabled', false).removeClass("layui-btn-disabled");
            } else if (_co_status == '55') {
                $('#bn-co-add-multi,#bn-co-del-multi,#bn-co-cfm-multi,#bn-co-use-multi').prop('disabled', true).addClass("layui-btn-disabled");
                $('#bn-co-unuse-multi').prop('disabled', false).removeClass("layui-btn-disabled");
            } else if (_co_status == '77') {
                $('#bn-co-add-multi,#bn-co-del-multi,#bn-co-cfm-multi,#bn-co-unuse-multi').prop('disabled', true).addClass("layui-btn-disabled");
                $('#bn-co-use-multi').prop('disabled', false).removeClass("layui-btn-disabled");
            }
        }

        showBns();


        var layerIdx;
        $("#bn-co-add-multi").click(function () {

            /* 表单初始赋值
            语法：form.val('lay-filter的值', object); */
            form.val("form-add-color", { //form-add-color是表单的lay-filter值
                "co_id": "",
                "co_name": "",
                "co_remark": "",
                "co_status": ""
            });
            layerIdx = layer.open({
                type: 1,
                title: '新增花色信息',
                area: ['700px', '600px'],
                content: $('#div-add-color') //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
            });
        });


        //监听新增表单提交。bn-cus-do-add是新增表单中提交按钮的lay-filter值
        form.on('submit(bn-doadd-color)', function (data) {
            //console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
            //console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回
            console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}


            //优化1.1
            opr.ajax({
                url: 'color',
                data: data.field,
                method: 'post',
                layer: layer,
                layuiTableIns: coTable,
                responseOkHandler: function (result) {
                    layer.close(layerIdx);
                    return true;//返回true,继续默认后续行为
                }
            });
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。


            //优化前
            // var index = layer.load(); //加载层
            // $.ajax({
            //     url: 'color',
            //     data: data.field,
            //     method: 'post',
            //     dataType: 'json'
            // }).done(function (result) {
            //     if (result.success) {
            //         coTable.reload();//重载表格
            //         layer.closeAll();
            //         swal({
            //             text: result.message,
            //             icon: "success",
            //             buttons: false,
            //             timer: 1500
            //         });
            //     } else {
            //         layer.close(index);
            //         swal({
            //             title: result.message,
            //             icon: "error",
            //             button: "确定"
            //         });
            //     }
            // }).fail(function (xhr) {
            //     layer.close(index);
            //     swal({
            //         title: xhr.status,
            //         text: '请于管理员联系。',
            //         icon: "error",
            //         button: "确定"
            //     });
            // });
            // return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。


        });


        //条件查询

        $('#bn-co-query').click(function () {
            //将表单参数封装为json对象
            var arr = $("#form-co-query").serializeArray();
            var params = {};
            /*
            {
                co_id:8888,
                co_name:'mmmm'
            }
             */
            for (var i = 0; i < arr.length; i++) {
                params[arr[i].name] = arr[i].value;
            }
            //传递查询参数重载表格（内部为ajax请求）
            coTable.reload({
                where: params,
                page: {
                    curr: 1
                    //重新从第 1 页开始
                }
            });
            showBns();//重新显示按钮
            return false;
        });


        //批量修改
        //确定多条数据
        $('#bn-co-cfm-multi').click(function () {

            changeMultiCusStatus('您确实要确定选择的花色信息吗？', '花色信息一旦被确定，将不能再被编辑！', '22', "info-color-table", coTable);

        });

        //启用多条数据
        $('#bn-co-use-multi').click(function () {

            changeMultiCusStatus('您确实要启用选择的花色信息吗？', '', '55', "info-color-table", coTable);

        });

        //禁用多条数据
        $('#bn-co-unuse-multi').click(function () {

            changeMultiCusStatus('您确实要禁用选择的花色信息吗？', '花色信息一旦被禁用，将不能被使用！', '77', "info-color-table", coTable);

        });


        //函数：改变多个客户信息状态
        /*
        {
            title:"标题";
            text:"提示信息";
            status:"要修改的状态";
            tableID:"数据表格id";
            Table:"";
        }
        */
        function changeMultiCusStatus(title, text, status, tableID, Table) {
            var checkStatus = table.checkStatus(tableID); //基础参数id对应的值
            console.log(checkStatus.data) //获取选中行的数据(数组)
            //console.log(checkStatus.data.length) //获取选中行数量，可作为是否有选中行的条件
            //console.log(checkStatus.isAll ) //表格是否全选

            if (checkStatus.data.length == 0) {
                swal({
                    text: '您没有选择任何数据！',
                    icon: "error",
                    buttons: false,
                    timer: 1500
                });
                return;
            }

            var arr = [];
            $.each(checkStatus.data, function () {
                arr.push(this.co_id);
            });

            //优化1.1
            opr.ajaxWithConfirm({
                title: title,
                text: text,
                url: 'color/status/' + status,
                data: JSON.stringify(arr),
                contentType: 'application/json;charset=UTF-8',
                method: 'put',
                layer: layer,
                layuiTableIns: coTable,
            });

            //优化前
            // swal({
            //     title: title,
            //     text: text,
            //     icon: "warning",
            //     buttons: [
            //         "取消",
            //         {text: '确认', closeModal: false}
            //     ],
            //     dangerMode: true,
            // })
            //     .then(function (ok) {
            //         if (ok) {
            //
            //             $.ajax({
            //                 url: 'color/status/' + status,
            //                 data: JSON.stringify(arr),//
            //                 contentType: 'application/json;charset=UTF-8',
            //                 method: 'put',
            //                 dataType: 'json'
            //             }).done(function (result) {
            //                 if (result.success) {
            //                     swal({
            //                         text: result.message,
            //                         icon: "success",
            //                         buttons: false,
            //                         timer: 1500
            //                     });
            //                     Table.reload();//重载数据
            //                 } else {
            //                     swal({
            //                         title: result.message,
            //                         icon: "error",
            //                         button: "确定"
            //                     });
            //                 }
            //
            //             }).fail(function (xhr) {
            //                 swal({
            //                     title: xhr.status,
            //                     text: '请于管理员联系。',
            //                     icon: "error",
            //                     button: "确定"
            //                 });
            //             });
            //
            //
            //         }
            //
            //
            //     })
            //     .catch(function (err) {
            //         if (err) {
            //             console.log(err);
            //             swal("操作失败!", "请于管理员联系。", "error");
            //         } else {
            //             swal.stopLoading();//停止加载显示
            //             swal.close();//关闭提示框
            //         }
            //     });

        }//函数：改变多个客户信息状态结束


        //批量删除
        $("#bn-co-del-multi").click(function () {


            var checkStatus = table.checkStatus('info-color-table'); //基础参数id对应的值
            console.log(checkStatus.data); //获取选中行的数据(数组)
            //console.log(checkStatus.data.length) //获取选中行数量，可作为是否有选中行的条件
            //console.log(checkStatus.isAll ) //表格是否全选

            var arr = [];
            $.each(checkStatus.data, function () {
                arr.push(this.co_id);
            });

            //优化1.1
            opr.ajaxWithConfirm({
                title: "您确实要删除选择的数据吗?",
                text: "数据一旦删除将无法恢复!",
                url: 'color',
                data: JSON.stringify(arr),
                contentType: 'application/json;charset=UTF-8',
                method: 'delete',
                layer: layer,
                layuiTableIns: coTable,

            });


            //优化前
            // $.ajax({
            //     url: 'color',
            //     data: JSON.stringify(arr),
            //     contentType: 'application/json;charset=UTF-8',
            //     method: 'delete',
            //     dataType: 'json'
            // }).done(function (result) {
            //     if (result.success) {
            //         layer.msg(result.message);
            //         coTable.reload();
            //     } else {
            //         layer.msg(result.message);
            //     }
            //
            // }).fail(function (xhr) {
            //     layer.msg(xhr);
            // });
            //
            //
            // layer.close(index);
            //向服务端发送删除指令


        });

    });
</script>


<!--add弹出窗口内容  -->
<div style="padding: 5px;display:none" id="div-add-color">
    <form class="layui-form" lay-filter="form-add-color">
        <%--<div class="layui-form-item">
            <label class="layui-form-label">花色ID</label>
            <div class="layui-input-block">
                <input type="text" name="co_id" required lay-verify="required"
                    placeholder="请输入花色ID" autocomplete="off" class="layui-input">
            </div>
        </div>--%>

        <div class="layui-form-item">
            <label class="layui-form-label">花色名字</label>
            <div class="layui-input-block">
                <input type="text" name="co_name" required lay-verify="required"
                       placeholder="请输入花色名字" autocomplete="off" class="layui-input">
            </div>
            <!-- <div class="layui-form-mid layui-word-aux">花色名字验证</div> -->
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">花色描述</label>
            <div class="layui-input-block">
                <input type="text" name="co_remark" required lay-verify="required"
                       placeholder="请输入花色描述" autocomplete="off" class="layui-input">
            </div>
            <!-- <div class="layui-form-mid layui-word-aux">花色描述</div> -->
        </div>

        <%--<div class="layui-form-item">--%>
        <%--<label class="layui-form-label">花色状态</label>--%>
        <%--<div class="layui-input-block">--%>
        <%--<!-- 00-未确定 22-确定 55-启用 77-禁用 99-逻辑删除 -->--%>
        <%--<select name="co_status" required lay-verify="required">--%>
        <%--<option value="">状态</option>--%>
        <%--<option value="00">未确定</option>--%>
        <%--<option value="22">确定</option>--%>
        <%--<option value="55">启用</option>--%>
        <%--<option value="77">禁用</option>--%>
        <%--<option value="99">逻辑删除</option>--%>
        <%--</select>--%>
        <%--</div>--%>
        <%--<!-- <div class="layui-form-mid layui-word-aux">花色状态</div> -->--%>
        <%--</div>--%>


        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="bn-doadd-color">提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</div>


<!--update弹出窗口内容  -->
<div style="padding: 5px;display:none" id="div-update-color">
    <form class="layui-form" lay-filter="form-update-color">
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="hidden" name="co_id" required lay-verify="required"
                       placeholder="请输入花色ID" autocomplete="off" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">花色名字</label>
            <div class="layui-input-block">
                <input type="text" name="co_name" required lay-verify="required"
                       placeholder="请输入花色名字" autocomplete="off" class="layui-input">
            </div>
            <!-- <div class="layui-form-mid layui-word-aux">花色名字验证</div> -->
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">花色描述</label>
            <div class="layui-input-block">
                <input type="text" name="co_remark" required lay-verify="required"
                       placeholder="请输入花色描述" autocomplete="off" class="layui-input">
            </div>
            <!-- <div class="layui-form-mid layui-word-aux">花色描述</div> -->
        </div>

        <%--<div class="layui-form-item">--%>
        <%--<label class="layui-form-label">花色状态</label>--%>
        <%--<div class="layui-input-block">--%>
        <%--<!-- 00-未确定 22-确定 55-启用 77-禁用 99-逻辑删除 -->--%>
        <%--<select name="co_status" required lay-verify="required">--%>
        <%--<option value="">状态</option>--%>
        <%--<option value="00">未确定</option>--%>
        <%--<option value="22">确定</option>--%>
        <%--<option value="55">启用</option>--%>
        <%--<option value="77">禁用</option>--%>
        <%--<option value="99">逻辑删除</option>--%>
        <%--</select>--%>
        <%--</div>--%>
        <%--<!-- <div class="layui-form-mid layui-word-aux">花色状态</div> -->--%>
        <%--</div>--%>


        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="bn-doupdate-color">提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</div>


</body>
</html>
